<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>在线定时任务</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script>
    <script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <style type="text/css">
        .modal-dialog{
            width: 700px;
        }
    </style>
</head>
<body>

<div class="container">
    <h2>任务管理</h2>
    <p>任务列表</p>
    <table class="table table-striped">
        <thead>
        <tr>
            <th>任务名称</th>
            <th>任务状态</th>
            <th>定时任务表达式</th>
            <th>class文件路径</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody id="taskList">
        </tbody>
    </table>
    <input type="button" value="文件列表" onclick="javaScript:window.location='/task-manager/fileManager.html'">
</div>


<!-- 模态框（Modal） -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">任务查看</h4>
            </div>
            <div class="modal-body"></div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary" data-dismiss="modal">关闭</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>


</body>
<script type="application/javascript">


    $(document).ready(function () {




            $.ajax({
                url: "/task-manager/task",
                dataType:'json',
                type:'post',
                success: function(data){
                    var html;
                    for(var json in data){
                        var taskName= data[json].taskName;
                        var status= data[json].status;
                        var crontab= data[json].crontab;
                        var classPath= data[json].classPath;
                        var taskId= data[json].taskId;
                        var btnName="日志查看";

                    html+="<tr><td>"+taskName+"</td><td>"+status+"</td>" +
                       "<td>"+crontab+"</td><td>"+classPath+"</td>"+
                        "<td><input type='button' class='btn-sm btn-info manage' taskid='"+taskId+"'  classPath='"+classPath+"'   value='"+btnName+"' </td>"
                        +"</tr>";
                    }
                     $("#taskList").html(html);
                }})

             $(document).on("click",".manage",function () {
                  var taskId=$(this).attr("taskid");
                  var classPath=$(this).attr("classPath");

                 $.ajax({
                     url: "/task-manager/getLog",
                     dataType: 'json',
                     type: 'post',
                     data:{collectorName:classPath},
                     success: function (data) {
                        var html="<table>";
                          html+="<tr><td>进程编号："+ taskId+"</td></tr>";
                        for(var json in data){
                            html+="<tr><td>"+data[json]+"</td></tr>";
                        }

                        html+="</table>";

                         $(".modal-body").html(html);

                     }
                 });

                 $('#myModal').modal('show');
            });

        });

</script>
</html>